<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="../js/vue.js"></script>
</head>
<body>
   <div id="app">
       <!--输入框-->
       <input type="text" v-model="val">
       <h3>{{val}}</h3>
       <!--单选框-->
       男：<input type="radio" value="男" v-model="sex"> <br/>
       女：<input type="radio" value="女" v-model="sex">
       <h3>{{sex}}</h3>
       <!--复选框-->
       学习：<input type="checkbox" value="学习" v-model="info"> <br/>
       看动漫：<input type="checkbox" value="看动漫" v-model="info"> <br/>
       玩耍：<input type="checkbox" value="玩耍" v-model="info"> <br/>
       <h3>{{info}}</h3>
       <!--单选下拉框-->
       <select v-model="selected">
           <option disabled value="">请选择</option>
           <option>A</option>
           <option>B</option>
           <option>C</option>
       </select>
       <h3>{{selected}}</h3>
       <!--多选下拉框-->
       <select v-model="selecteds" multiple>
           <option disabled value="">请选择</option>
           <option>A</option>
           <option>B</option>
           <option>C</option>
       </select>
       <h3>{{selecteds}}</h3>
   </div>
</body>
<script>

    var app = new Vue({
        el:"#app",
        data:function () {
            return {
                val:"hello vue",
                sex:"",
                info:[],
                selected:"",
                selecteds:[]
            };
        },
        methods:{

        }
    });


</script>
</html>